<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c" %>
<% 
    String context = request.getContextPath();
    request.setAttribute("context",context);
%>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <title>用户</title>
    <link href="${context}/static/jquery-easyui-1.3.2/themes/icon.css" rel="stylesheet" type="text/css" />
    <script src="${context}/static/jquery-easyui-1.3.2/jquery-1.8.0.min.js" type="text/javascript"></script>
    <script src="${context}/static/jquery-easyui-1.3.2/locale/easyui-lang-zh_CN.js" type="text/javascript"></script>
    <script src="${context}/static/scripts/json2.js" type="text/javascript"></script>
    <script src="${context}/static/scripts/common.js" type="text/javascript"></script>
    <link href="${context}/static/bootstrap/css/bootstrap.css" rel="stylesheet" type="text/css" />
    <script src="${context}/static/bootstrap/js/bootstrap.js" type="text/javascript"></script>     
    <link href="${context}/static/scripts/pager/pagination.css" rel="stylesheet" type="text/css" />
    <script src="${context}/static/scripts/pager/jquery.pagination.js" type="text/javascript"></script>     
<head>
<style type="text/css">
	div.container
	{
	width:960px;
	margin:0px;
	line-height:150%;
	margin-left: auto;
	margin-right: auto;
	}
	div.header,div.footer
	{
	padding:0.5em;
	clear:left;
	background-color:#99CCFF
	}
	h1.header
	{
	padding:0;
	margin:0;
	}
	div.left
	{
	float:left;
	width:150px;
	margin:0;
	padding:1em;
	padding:0px;
	}
	div.content
	{
	margin-left:150px;
	padding:1em;
	}
	
	
	.middleDiv {
		margin-left: auto;
		margin-right: auto;	
	}
	
	.main{ width:700px; margin-right:20px;margin-left:20px;margin-top:5px; float:left;padding:0px}
	
	ul{padding: 5px 5px 0 0; text-decoration:none;margin:0px}
	li{ list-style-type:none;  border-bottom:1px #c2d5e3 dashed;  margin-bottom:5px; padding-bottom:5px;}
	li:last-child{ border:none;}
	a{ text-decoration:none!important; }
	a:link {color:rgb(16,92,182);}		/* 未被访问的链接 */
	a:visited {color:#330099;}	/* 已被访问的链接 */
	a:hover {color:rgb(255,0,0);}	/* 鼠标指针移动到链接上 */
	.title{ font-size:14px;white-space: nowrap; text-overflow:ellipsis; overflow:hidden;}

</style>
    
    <script type="text/javascript">
 		var items_per_page=15;
 		var currentSourceType=null;
 		var currentType=null;
 		
 		function initPager(count,callback) {
			var pagerOpinion={"items_per_page":items_per_page,"num_display_entries":10,"num_edge_entries":2,"prev_text":"上一页","next_text":"下一页"};
         	pagerOpinion.callback=callback;
            $("#Pagination").pagination(count,pagerOpinion);  		
 		} 
 		
        function onPagerClick(pageIndex) {
        	getTypePager(pageIndex,currentSourceType,currentType);
        }
        
        function onPagerClickf(pageIndex) {
        	getFTypePager(pageIndex);
        }        
        
        function initItems(rows) {
        	$("#items").html("");
        	for(var i=0;i<rows.length;i++) {
        		var cnblog=rows[i];
        		var item="<li class='title'><a href='${context}/wread/readItem.html?id="+cnblog.id+"&userId=duankaige' target='_blank'>"+cnblog.title+"</a></li>";
        		$(item).appendTo($("#items"));
        	}        
        } 		
 		
        $(document).ready(function(){
         	currentSourceType="0";
 			currentType="0";
			getTypePager(0,currentSourceType,currentType,true);      
			
			
			$(".nav-list li").bind("click",function(obj) {
				$(".nav-list li").removeClass("active");
				$(obj.currentTarget).addClass("active");
			});
			
			        
         }); 	
        
        
 		function getTypePager(page,sourceType,type,initPagerFlag) {
 			currentSourceType=sourceType;
 			currentType=type;
			var paramPager={"page":page,"size":items_per_page,"sourceType":sourceType,"type":type};
		    $.ajax({
		        url: "${context}/wread/getPagerList.html",
		        data: paramPager,
		        dataType: "json",
		        type: "GET",
		        async: false,
		        success: function (result) {
		        	var rows=result.rows;
		        	var total=result.total;
					initItems(rows);
					if(page==0 && initPagerFlag) {
						initPager(total,onPagerClick);
					}
		        }
		    });	 	  		
 		}
 		
 		function getFTypePager(page,initPagerFlag) {
			var paramPager={"userId":"duankaige","size":items_per_page,"page":page};
		    $.ajax({
		        url: "${context}/wread/getFPagerList.html",
		        data: paramPager,
		        dataType: "json",
		        type: "GET",
		        async: false,
		        success: function (result) {
		        	var rows=result.rows;
		        	var total=result.total;
					initItems(rows);
					if(page==0 && initPagerFlag) {
						initPager(total,onPagerClickf);
					}
		        }
		    });			
 		}
 		
 		
    </script>
</head>
<div class="container">

	<div class="header">
		<!-- Save for Web Slices (未标题-5) -->
		<img src="${context}/static/images/top.gif" width="951" height="100" alt="">
		<!-- End Save for Web Slices -->	
	</div>
	<div class="left">
      <div class="well" style="padding: 8px 0; width:150px;">
        <ul class="nav nav-list">
          <li class="nav-header">博客园</li>
	          <li class="active"><a href="#" onclick="getTypePager(0,0,0,true);return false;">最新新闻</a></li>
	          <li><a href="#" onclick="getTypePager(0,0,1,true);return false;"></i>48小时阅读排行</a></li>
	          <li><a href="#" onclick="getTypePager(0,0,2,true);return false;"></i>10天内推荐排行</a></li>
          <li class="nav-header">JavaEye</li>
	          <li><a href="#" onclick="getTypePager(0,2,0,true);return false;">每日资讯</a></li>
	          <li><a href="#" onclick="getTypePager(0,2,1,true);return false;">博文推荐</a></li>   
          <li class="nav-header">智联招聘</li>
	          <li><a href="#" onclick="getTypePager(0,2,0,true);return false;">上海 JAVA高级</a></li>
          <li class="nav-header">收藏夹</li>
	          <li><a href="#" onclick="getFTypePager(0,true);return false;">我的收藏</a></li>	          
	          <li><a href="#" onclick="getTypePager(0,1,0,true);return false;">自定义添加</a></li>
        </ul>
      </div> <!-- /well -->
	</div>
	
 	<div class="content">
		<div class="main">
			<ul id="items">			
			</ul>
            <div id="Pagination" class="pagination"></div>
		</div>	
    </div>
	
	<div class="footer"><h1 class="header">footer</h1><h1 class="header">&nbsp;</h1><h1 class="header">&nbsp;</h1></div>
	
</div>

</body>
</html>
